<!DOCTYPE html>
<html>
  <style>
    /* .demo1{
      width: 30px;
      border: 50px solid red;
      border-radius: 0 0 0 100%;
    } */
    /* .demo2-1 {
      background-color: #999;
      width: 100%;
      height: 100%;
      position: fixed;
      top: 0;
      left: 0;
    }
    .demo2-2 {
      background-color: #666;
      width: 100px;
      height: 100px;
      position: fixed;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    } */
    /* .demo3 {
      width: 100px;
      background-color: #999;

    }
    .demo3-1 {
      width: 100%;
      padding-top: 50%;
    } */
  </style>
  <body>
    <!-- <div class="demo1">
    </div> -->
    <!-- <div class="demo2-1">
      <div class="demo2-2">
        弹窗
      </div>
    </div> -->
    <!-- <div class="demo3">
      <div class="demo3-1"></div>
    </div> -->
  </body>
  <script>
    // 异步加载js文件
    function loadScript(url, callback){
      const script = document.createElement("script")
      script.type = "text/javascript"
      if (script.readyState){ //IE
        script.onreadystatechange = function(){
          if (['complete', 'loaded'].includes(script.readyState)){
            script.onreadystatechange = null
            callback()
          }
        }
      } else { //Others: Firefox, Safari, Chrome, and Opera
        script.onload = function(){
          callback()
        }
      }
      script.src = url
      document.body.appendChild(script)
    }

    loadScript('http:/xxx.min.js', function() {
        alert('ok')
    })
  </script>
</html>